@import "toolkit";
@bordercolor:#87698c;
@lightgrey:#888888;
@beautyblue: #3DB0A4;

@font-face {
  font-family: 'Bad Script';
  font-style: normal;
  font-weight: 400;
  src: local('Bad Script Regular'), local('BadScript-Regular'), url('https://themes.googleusercontent.com/static/fonts/badscript/v2/rL_b2ND61EQmMOJ8CRr1fhsxEYwM7FgeyaSgU71cLG0.woff') format('woff');
}

@font-face {
  font-family: 'Niconne';
  font-style: normal;
  font-weight: normal;
  src: local('Niconne'), local('Niconne-Regular'), url('https://themes.googleusercontent.com/static/fonts/niconne/v3/Pt5YCk9yiMzehxqMoOcZoQ.woff') format('woff');
}

.cs-prev,.cs-next {display:none}

.opacity (@param) {
	opacity: @param;
	-moz-opacity: @param;
	-webkit-opacity: @param;
	-o-opacity: @param;
	-ms-opacity: @param;
	filter:alpha(opacity=@param);
}

.homepage-imgpannel {
	width:98%;
	min-width:30em;
	margin-right:10%;
	.map {
		float:left;
		h2 {margin-bottom:3%}
		width:48%;
		min-width: 25em;
	}
	.rassure {
		min-width: 25em;
		width:48%;
		.btn {
			float:right;
			margin-right: 10%;
			margin-top:5%;
			display:block;
		}
		float:left;
		margin-left:2%;
		font-size:1.2em;
		p{
		}
		h2 {
			margin-bottom:3%;
		}
		ul {
			li {
				font-size: 1em;
				span {
					color:#88255A;
					font-weight:bold;
					font-size:1.1em;
				}
			}
		}
	}
	overflow: hidden;
	background: #f0e7e8;
	padding: 2% 1% 2% 2%;
	.border-radius(0.5em);
	box-shadow:0 0 0.7em #3d3d3d inset;
	h2 {
		text-shadow:0.08em 0.09em 0.01em #CCCCCC;
	}
}


.homepage-ville {
	min-width:10em;
	box-shadow:0 0 0.1em #000000 inset;
	font-family: Niconne,'Times New Roman',sans-serif;
	position: absolute;
	z-index:99;
	width:30%;
	min-width: 3em;
	font-size:2em;
	line-height: 1.2em;
	background: #fff;
	border: 0.2em solid #87698C;
	.opacity(0.8);
	margin:1% 0px 0px 1%;
	padding: 1%;
	.border-radius(0.4em);
	a {display:block;
		margin:2%;
		font-family:sans-serif;
		text-decoration:none;
		text-transform:uppercase;
	}
}
.header-newsletterform {
background-image: linear-gradient(bottom, rgb(216,213,217) 42%, rgb(204,204,204) 71%);
background-image: -o-linear-gradient(bottom, rgb(216,213,217) 42%, rgb(204,204,204) 71%);
background-image: -moz-linear-gradient(bottom, rgb(216,213,217) 42%, rgb(204,204,204) 71%);
background-image: -webkit-linear-gradient(bottom, rgb(216,213,217) 42%, rgb(204,204,204) 71%);
background-image: -ms-linear-gradient(bottom, rgb(216,213,217) 42%, rgb(204,204,204) 71%);

background-image: -webkit-gradient(
	linear,
	left bottom,
	left top,
	color-stop(0.42, rgb(216,213,217)),
	color-stop(0.71, rgb(204,204,204))
);
	max-height: 10%;
}

.sliderimg {
	width:100%;
}

.cs-coin-slider {
	background-size: 100% auto !important;
	width:100% !important;
}

.header-regionmenuarrow {
	background: #20AB9C;
}

.beautygreen {
	background-color: #20AB9C;
	color: #fff;
	.border-radius(3px);
	.inline-block();
	text-decoration:none;
	box-shadow:0 0 10px #147167 inset;
	text-align:center;
	text-transform:uppercase;
	padding: 0.3em;
	font-size:0.9em;
	margin-bottom: 30px;
	&:hover {
		background-color: #4cc6b9;
		text-decoration:none;
		color:#fff;
	}
}

.beautybutton {
	background-color: @beautyblue;
	color: #fff;
	.border-radius(3px);
	.inline-block();
	text-decoration:none;
	box-shadow:0 0 3px #05453C inset;
	text-align:center;
	text-transform:uppercase;
	padding: 0.3em;
	font-size:0.9em;
	margin-bottom: 30px;
	&:hover {
		background-color: #4cc6b9;
		text-decoration:none;
		color:#fff;
	}
}

.coiffeur-main {
	min-width: 15em;
}
.coiffeur-textsize {
	.coiffeur-coiffeurinfo {
		div {
			.beautybutton {
				margin:0px 0px 3% 0px !important;
			}
		}
		color: white;
		text-transform:uppercase;
	}
	overflow: hidden;
	.goodbg {
		background: -moz-linear-gradient(left center , #1A1A1A 0pt, #404040 100%) repeat scroll 0 0 transparent;
		padding:1%;
		margin-right:4%;
		overflow: hidden;
		.inline-block();
		float:left;
		.thumbnail {
			margin-right: 5%;
		}
	}
}

.coiffeur-description {
	font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif;
	color:#676767;
	font-size:1.1em;
}

.coiffeur-coiffeur-infoblock {
	margin-top: 0.5em;
	.coiffeur-coiffeurtown {
		background: none repeat scroll 0 0 lighten(#888888, 35%);
		border: 1px solid rgba(100,100,100,0.1);
		padding: 0.2em;
	}
	.coiffeur-bookit {
		float:right;
		padding:0.5em 1em 0.5em 1em;
	}
}

.coiffeur-coiffeurlink {
		h3 {
			font-size:2.4em;
			font-family:Georgia,Times,'Times New Roman';
			.inline-block();
			margin-top: 0.5em;
		}
		color:black;
		text-decoration:none !important;
}

body {
	#homepage-signup {
		clear:both;
		display:block;
		border-bottom:1px dashed #959595;
		border-top:1px dashed #959595;
		color:#959595;
		font-family:'Bad Script',sans-serif;
		overflow: hidden;
		padding-top: 2%;
		text-align:center;
		h2 {
			margin-bottom:0.3em;
			font-weight:normal!important;
			font-size:2.8em !important;
			span {
				color:#1EAB9C;
			}
		}
		.homepage-signupbutton {
			padding: 0.6em 1em 0.5em 1em;
			font-size: 200%;
			float:right;
			margin-bottom: 2%;
			margin-right:5%;
		}
	}

	background: #f5f5f4;
	.body {
		margin: 0px 5% 2% 5%;
		background: #3D3D3D;
		border-radius: 22% 0% 2% 2%;
		border:0.2em solid #1EAB9C;
	}
	margin-top: 60px;
	z-index:-1;
	p {
		color: #87698c;
		font-size: 15px;
		margin: 6px 0px 6px 4px;
	}
	a {
	color: #87698c;
	text-decoration:underline;
	  &:hover {
	  	color: #2549AA;
	  }
	}

	h1 {

	}

	.header-newsletterform {
		box-shadow:0 0 0.7em #ffffff inset;
		float:right;
		width:30%;
		min-width:17em;
		legend {
			font-family: Niconne, 'Times New Roman', sans-serif;
		font-size:2.5em;
		max-height:1.1em;
		}
		label {
			width:33%;
			display:block;
			overflow: hidden;
			float:left;
			input {margin-left:2px;}
			input.btn {
				width:53%;
				margin-left:15%;
			}
		}
	}

	#coin-slider-coin-slider {
		overflow: visible !important;
		width:100% !important;
		float:left;
		#coin-slider {
			.border-radius(0px 4px 4px 4px);
			border: 1px solid @bordercolor;
		}
	}


	.header-regionmenu {

		position: absolute;
		z-index:100;
		margin-left:2%;
		.header-regionmenuarrow {
			position:relative;
			top: -2.2em;
			.header-list {
				font-size:0.7em;
				margin-top:0.7em;
				box-shadow:0 0 0.2em #000000 inset;
			}
			box-shadow: 3px 3px 4px rgba(0,0,0,0.3);
			.inline-block();
			padding: 0.3em;
			font-size:1.6em;
			color:white;
			.border-radius(5px 5px 0px 0px);
			border: 1px solid @bordercolor;
background-image: linear-gradient(bottom, rgb(17,194,150) 20%, rgb(56,163,140) 53%);
background-image: -o-linear-gradient(bottom, rgb(17,194,150) 20%, rgb(56,163,140) 53%);
background-image: -moz-linear-gradient(bottom, rgb(17,194,150) 20%, rgb(56,163,140) 53%);
background-image: -webkit-linear-gradient(bottom, rgb(17,194,150) 20%, rgb(56,163,140) 53%);
background-image: -ms-linear-gradient(bottom, rgb(17,194,150) 20%, rgb(56,163,140) 53%);

background-image: -webkit-gradient(
	linear,
	left bottom,
	left top,
	color-stop(0.2, rgb(17,194,150)),
	color-stop(0.53, rgb(56,163,140))
);


			&:hover > .header-list {
				display:block;
			} 
		}
		.header-list {
			background: #f0e7e8;
			overflow: hidden;
			border: 1px solid @bordercolor;
			display:none;
			z-index:100;
			margin:0px;
			.border-radius(0px 4px 4px 4px);
			p {
				color:black;
				font-size:1.2em;
				margin:1em;
			}
			.header-region {
				li {
					a {
						color:black;
						text-decoration:none;
					}
				}
				float:left;
				list-style-type:none;
				border-right: 1px solid @bordercolor;
				padding-right: 20px;
			}
		}
	}


	.header-aftermenu {
		margin-bottom:3%;
	}


		.coiffeur-infos {
			background:#fff;
			.border-radius(0px 4px 4px 4px);
			border: 1px solid lighten(#888888, 20%);
			margin-right: 1%;
			margin-bottom:3%;
			padding-left:5%;
			min-width:10em;
			h2 {
				font-size:1.2em;
			}
			ul {
				list-style-type:none;
				margin-left:0;
				li {
				border-bottom: 1px solid lighten(black,80%);
				}
			}
		}
		.region-body {
		background: #f0e7e8;
		border: 1px solid @lightgrey;
		.border-radius(3% 0.4% 2% 2%);
		box-shadow:0 0 3px #05453C inset;
		padding: 20px 3% 1% 1%;
		overflow: hidden;
		.region-path {
			background-color: #d0d0d0;
			.border-radius(4px);
			padding-left: 10px;
			margin-bottom:20px;
			box-shadow:0px 0px 1px #000000 inset;
			a {
				margin-right:10px;
				text-decoration:underline;
				color:black;
			}
			h1 {
				display:inline;
				margin-left:10px;
				font-size:13px;
				font-style:none;
			}
		}
		.region-coiffeurlist {
			li {
				font-size:130%;
				.region-textsize {
					font-size:100%;
					margin-bottom:2%;
					.region-coiffeurlink {
						h3 {
							color:#000;
						}
						display: block;
						list-style-type: circle;
					}
				}
			}
		}
	}

	footer {
		.footer-block {
			padding-left:10%;
			padding-top:2%;
			padding-bottom: 10%;
			float:left;
			.foot-bl {
				width: 50%;
				min-width: 15em;
				float:left;
				margin-right:5%;
				h3 {
				color:#A6A6A6;
				border-top:1px solid  #808080;
				margin-top:1em;
				padding-top:1em;
				text-transform:uppercase;
				font-size:1.1em;
				}
				p {color:#808080; font-style:italic}
				&.foot-secondbl{
					width:20%;
					min-width: 15em;
					margin-left:0%;
				}
			}
				margin-top: 5%;
				background: #404040;
				width:100%;
				overflow: hidden;
		}
	}
}

section {overflow: hidden;}
.coiffeur-tabservice {
		font-family:'Palatino Linotype','Book Antiqua',Palatino,serif;
	td {
	 	padding:0.1em 0.3em 0.1em 0.3em;
	}
	table {
		margin-left: 6% !important;
		margin-top: 10%;
	}
	ul,p,table {
		font-size:1.3em;
		color:#676767;
		margin-left:5%;
	}
	ul {
		margin-top:5%;
		list-style-type:none;
	}
	float:left;
	min-width:18em;
	background:url(/static/img/grid.png)  repeat scroll 0 0 transparent;
	border-bottom:none;
	margin-top: 5%;
	border-top:0.1em solid #676767;
	border-bottom: 0.1em solid rgba(50,50,50,0.08);
	border-left: 0.1em solid rgba(50,50,50,0.08);
	border-right: 0.1em solid rgba(50,50,50,0.08);
	padding:0px 0px 5% 0px;
	width: 30%;
	h1 {
		color:#fff;
		background: none repeat scroll 0 0 #676767;
		.inline-block();
		padding: 0.4% 2.5% 0.4% 2.5%;
		font-size:1.6em;
		font-weight:normal;
		font-family:georgia, sans-serif;
	}

	p {
		font-family: Georgia, sans-serif;
		font-size:1.3em;
	}
}

.coiffeur-tab {
	font-family:georgia, sans-serif;
	float:left;
	min-width:40em;
	.inline-block();
	border-top:0.1em solid #676767;
	background:none;
	border-bottom:none;
	margin-top: 5%;
	padding:0;
	width: 60%;
	margin-right: 5%;
	h1 {
		color:#fff;
		background: none repeat scroll 0 0 #676767;
		.inline-block();
		padding: 0.4% 0.8% 0.4% 0.8%;
		font-size:1.6em;
		font-weight:normal;
	}
}

.region-hourinput {
	margin-bottom: 20% !important;
}

.region-coiffeurlist {
	.thumbnail {
		margin-top: 1%;
		margin-right: 2%;
		margin-bottom: 0px;
	}
	.region-coiffeur-infoblock {
		.inline-block();
		margin-right: 4%;
		vertical-align:bottom;
	}
	li {
		border-bottom: 1px solid #DDDDDD;
		img {
			width:100px;
		}
		.region-coiffeurtown {
			display:block;
		}
		.region-coiffeur-recommandation {
			float:left;
			margin-right: 30px;
			margin-bottom:2%;
		}
		.region-coiffeur-rating-output {
			float:left;
			margin-right: 30px;
		}
	}
}

.region-coiffeur-rating {
	float:left;
	margin-right: 20px;
}

.rating_bar_stars {
	background: url(/static/img/rate_off.gif) no-repeat;
	width: 64px;
	height: 20px;
	div {
		background: url(/static/img/rate_on.gif) no-repeat;
		height:20px;
	}
}

.regionsubmit {
	float: right;
	position: relative;
	top: -20px;
}


.body {
	header.h {
		position : relative;
		top: -0.2em;
		left: -0.2em;
		padding-bottom: 2.2em;
		width:100.5%;
	}
}


header {
	a {float:left; width:23%; min-width:200px;margin-left:0%}
	p {float:left; max-width:40%;min-width:10em !important}
	form {float:left !important; margin-left:2%}
	overflow: hidden;
	background: #f1f1ee;
	border-top: 1px solid grey;
	border-bottom: 1px solid grey;
	padding-top: 10px;
	padding-bottom:10px;
	margin-bottom: 10px;
	h1 {display:none}
	p {
		text-align:center;
		padding-top:5px;
		.inline-block();
		font-size:2.6em;
	 	font-family: 'Bad Script', 'Times New Roman', sans-serif;
	 	font-style:italic;
	 	height:100%;
	 	width:45%;
	 	line-height: 1.2em;
	 	overflow: hidden;
	 	min-width:6em;
		max-height:2.5em;
	 	span {
			color:#1EAB9C;
	 	}
	}
}

form {
	overflow: hidden;
	background: #d0d0d0;
	box-shadow:0 0 0.7em #000000 inset;
	padding: 2% 2% 0% 2%;
	.border-radius(4px);
background-image: linear-gradient(bottom, #B5C7AF 0%, #CFE0C9 73%);
background-image: -o-linear-gradient(bottom, #B5C7AF 0%, #CFE0C9 73%);
background-image: -moz-linear-gradient(bottom, #B5C7AF 0%, #CFE0C9 73%);
background-image: -webkit-linear-gradient(bottom, #B5C7AF 0%, #CFE0C9 73%);
background-image: -ms-linear-gradient(bottom, #B5C7AF 0%, #CFE0C9 73%);

background-image: -webkit-gradient(
	linear,
	left bottom,
	left top,
	color-stop(0, #B5C7AF),
	color-stop(0.73, #CFE0C9)
);
	label {
		span {
			display:none;
		}
	}
	fieldset {
		legend {
			font-family: Niconne, ; 		font-size:2.5em;
		}
		input,select {
			display:block;
		}
		&.last {
		}
		.column {
			label span{
				
			}
			input {
				display:block;
				float:left;
				width:30%;
			}
		}
		border-right: 1px solid @lightgrey;
		padding-right:10px;
		margin-right:10px;
		float:left;
	}
}

.coiffeur-services {
	color:#999999;
	margin-top: 5%;
	width:100%;
	font-size:1.4em;
	font-family:'Palatino Linotype','Book Antiqua',Palatino,serif;
		thead {
			tr {
				td {
					padding-bottom:2%;
					border-bottom: 0.1em solid #666666;
				}
			}
		}
		tbody {
			tr {
				border-bottom: 0.1em solid lighten(#666666, 30%);
				td {
					color: #000;
					a {
						display:inline !important;
						min-width: 5em !important;
						margin: 0 !important;
					}
				}
				height : 4em;
			}
		}
}

.coiffeur-ratebar {
	margin:auto;
	display:block;
}

.coiffeur-leftinfo {
	float:left;
	overflow: hidden;
	margin-right: 1%;
	padding-right:1%;
	margin-bottom:2%;
	margin-left:2%;
}

.coiffeur-regionchoice {
	background: #ffffff;
	.border-radius(4px);
	border: 1px solid lighten(#888888, 20%);
	margin-right: 1%;
	margin-bottom:3%;
	padding-left:5%;
	padding-right:5%;
	min-width:10em;
	ul {
		h3 {
			margin-bottom: 1em;
		}
		font-size:80%;
		list-style-type:none;
		margin:0;
		padding-bottom:10%;
		li {
			a {
				text-decoration:none;
				color:black;
				border-bottom: 1px solid #cccccc;
				width:12em;
				padding-left:2%;
				.inline-block();
			}
		}
	}
}